
<script>src="<?php echo Yii::app()->request->baseUrl; ?>/assets/jquery-ui-1.11.0/jquery-ui.js"</script>
<script>src="<?php echo Yii::app()->request->baseUrl; ?>/assets/js/bootstrap-tab.js"</script>


	
<?php 
/*if($user = Yii::app()->session['user']==''){
	$this->redirect(Yii::app()->request->baseUrl.'/index.php/site/login');
	exit;
}*/
?>

<script>
function loadXMLDoc()
{
    var xmlhttp;
    if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
    else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
    xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("ShowData").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","CallUser",true);
    xmlhttp.send();
     
}

loadXMLDoc();

$(function (e) {
	  var parts = decodeURI(e.target).split('#');
	  $(".tabs").tabs().select(parts[1]);
	});

//var myVar=setInterval(function(){loadXMLDoc()},1000);

</script>

<div id="hotspot-user">

		<ul class="nav nav-tabs">
			<li class="active"><a data-toggle="tab" href="#tabs-1">User Hotspot</a></li>
			<li><a data-toggle="tab" href="#tabs-2">Active</a></li>
			
		</ul>
		<div class="tab-content">
		<div id="tabs-1" class="tab-pane fade in active">
		
			<!-- 			<button type="button" class="btn btn-primary btn-xs" -->
			<!-- 				onClick=window.open("add","demo","width=400,height=500,left=150,top=200,toolbar=0,status=0,");>Add User</button> -->
			<button type="button" class="btn btn-primary btn-xs"
				onClick="showframe('#hotspot-adduser');">Add User</button>
			<button type="button" class="btn btn-primary btn-xs"
				onClick="showframe('#hotspot-batchadduser');">Batch Add User</button>
			<p></p>
			
			<div id="ShowData">Loading</div>
		</div>
		<div id="tabs-2" class="tab-pane fade">
		
			<button type="button" class="btn btn-primary btn-xs">Kill</button>
			<p></p>
			<div id="ShowData">Loading</div>
		</div>
	</div>
</div>
<div id="hotspot-adduser" style="display: none; padding: 0 30px;">
	<div id="showajax"></div>
	<form class="form-horizontal" role="form">
		<fieldset>
			<legend>Add User</legend>
			<div class="form-group">
				<label>User</label> <input type="text" class="form-control"
					id="usename" placeholder="Username" />
			</div>
			<div class="form-group">
				<label>Password</label> <input type="text" class="form-control"
					id="password" placeholder="Password" />
			</div>
			<div class="form-group">
				<label>Byte In</label> <input type="text" class="form-control"
					id="bytein" value="0" placeholder="Byte In" />
			</div>
			<div class="form-group">
				<label>Byte Out</label> <input type="text" class="form-control"
					id="byteout" value="0" placeholder="Byte Out" />
			</div>
			<div class="form-group">
				<label>Byte Total</label> <input type="text" class="form-control"
					id="bytetotal" value="0" placeholder="Byte Total" />
			</div>
			<div class="form-group">
				<label>Uptime</label> <input type="text" class="form-control"
					id="uptime" value="0" placeholder="Uptime" />
			</div>
			<div class="form-group" style="padding: 10px 0;">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="button" id="btn-adduser" class="btn btn-default">Add</button>
					<button style="margin: 10px 0;" class="btn btn-default"
						onClick="showframe('#hotspot-user');">Back</button>
				</div>
			</div>
		</fieldset>
	</form>
</div>

<div id="hotspot-batchadduser" style="display: none; padding: 0 30px;">
	<div id="showajax"></div>
	<form class="form-horizontal" role="form">
		<fieldset>
			<legend>Batch Add User</legend>
			<div class="form-group">
				<label>Number of User</label> <input type="text"
					class="form-control" id="number_user" placeholder="Number of User">
			</div>
			<div class="form-group">
				<label>Username prefix</label> <input type="text"
					class="form-control" id="prefix" placeholder="prefix">
			</div>
			<div class="form-group">
				<label>Username length</label> <input type="text"
					class="form-control" id="name_length" placeholder="Username length">
			</div>
			<div class="form-group">
				<label>Password length</label> <input type="text"
					class="form-control" id="pass_length" placeholder="Password length">
			</div>
			<div class="form-group">
				<label>Byte Total</label> <input type="text" class="form-control"
					id="bytetotal" placeholder="Byte Total">
			</div>
			<div class="form-group">
				<label>Uptime</label> <input type="text" class="form-control"
					id="uptime" placeholder="Uptime">
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="button" id="btn-batchadduser" class="btn btn-default">Add</button>
					<button style="margin: 10px 0;" class="btn btn-default"
						onClick="showframe('#hotspot-user');">Back</button>
				</div>
			</div>
		</fieldset>
	</form>

</div>


<script type="text/javascript">
	var g_frame_animate_time = 100;
	function showframe(selector){
		$('#hotspot-user, #hotspot-adduser, #hotspot-batchadduser').fadeOut(g_frame_animate_time);
		_showframe(selector);
	}
	function _showframe(selector){
		setTimeout(function(){ $(selector).fadeIn(g_frame_animate_time); }, g_frame_animate_time+10);
	}


	$(function() {
	    $( "#tabs" ).tabs();
		$("#btn-adduser").click(function(){ 
			$.post("add2", {      
				usename: $("#usename").val(),
				password: $("#password").val(),
				bytein: $("#bytein").val(),
				byteout: $("#byteout").val(),
				bytetotal: $("#bytetotal").val(),
				uptime: $("#uptime").val()
				},function(data){ 
					$("#showajax").html(data);    
				}  
			    );    
	      });
		$("#btn-batchadduser").click(function(){ 
			$.post("Batchsubmit", {      
				number_user: $("#number_user").val(),
				password: $("#password").val(),
				prefix: $("#prefix").val(),
				name_length: $("#name_length").val(),
				pass_length: $("#pass_length").val(),
				bytetotal: $("#bytetotal").val(),
				uptime: $("#uptime").val()
				},     
				   function(data){ $("#showajax").html(data);    
				     }  );    
	      });
	});
</script>